<template>
  <el-button size="mini" type="danger" @click="modal">删除</el-button>
</template>

<script setup>
import { defineEmits, defineProps } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';

const props = defineProps({ title: String });
const emit = defineEmits(['handleDel']);

const modal = () => {
  let msg = props.title || '确定要删除？';
  ElMessageBox.confirm(msg, {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
    center: false,
  })
    .then(() => {
      emit('handleDel');
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '删除取消',
      });
    });
};
</script>
